<!-- 
   标准文档流:
       => html标签元素默认在网页上的排列方式

    css布局
       => 脱离标签文档流，按照想要的方式排列元素

        浮动
          float:left|right

        定位
          绝对定位
              语法: postion: absolute;   相对浏览器窗口
                    top:10px;
                    left:10px;

                    right:10px;
                    bottom:10px;
          相对定位
              语法:  postion:relative;   相对元素自身
                    top:10px;
                    left:10px;

          固定定位
               语法:  postion:fixed;   相对浏览器
                      top:10px;
                      left:10px;

            

        
        弹性盒子

-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        div{
            position: absolute;
        }
        span{
            position: relative;
        }
    </style>
</head>
<body>
    <div>内容</div>
    <span>元素一</span>
    <span>元素二</span>
    <div>内容2</div>
</body>
</html>